<img src="{$CONTEXT.STYLEIMG}m/banner_1.jpg">
<img src="{$CONTEXT.STYLEIMG}m/banner_line.jpg">

<div class="hmc">
<div class="h-row">
<div class="h-events">
<a href="javascript:void(0);"><span class="nav-left" id="h-events-nav-left"></span></a>
<div class="h-events-items" id="h-events-items">
<ul>
<li><a href="{$CONTEXT.URL}event/1"><img src="{$CONTEXT.STYLEIMG}m/h_events_1.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/2"><img src="{$CONTEXT.STYLEIMG}m/h_events_2.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/1"><img src="{$CONTEXT.STYLEIMG}m/h_events_1.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/2"><img src="{$CONTEXT.STYLEIMG}m/h_events_2.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
<li><a href="{$CONTEXT.URL}event/3"><img src="{$CONTEXT.STYLEIMG}m/h_events_3.jpg"></a></li>
</ul>
</div>
<a href="javascript:void(0);"><span class="nav-right" id="h-events-nav-right"></span></a>
</div>
<div class="h-news">
<span class="title"></span>
<ul>
{section name=item loop=$CONTENT.news_items}
<li><a href="{$CONTEXT.URL}n/{$CONTENT.news_items[item].link}{$CONTEXT.URL_SUFFIX}">{$CONTENT.news_items[item].subject}</a>
<span class="t">{$CONTENT.news_items[item].date_added|time}</span></li>
{/section}
</ul>
</div>
</div>

<div class="h-row">
<div class="h-products">
<span class="title"></span>
{section name=item loop=$CONTENT.products_items}
<div class="item" {if $smarty.section.item.index > 0} style="display: none; "{/if}>
<div class="imgd"><a href="{$CONTEXT.URL}p/{$CONTENT.products_items[item].link}{$CONTEXT.URL_SUFFIX}" title="{$CONTENT.products_items[item].name}">{pp_pimage src=$CONTENT.products_items[item].image eid=$CONTENT.products_items[item].id url=$CONTEXT.URLBASE path_prefix="===CONFIG_DIR_UPLOADS_RESIZED" width=$CONTENT.products_items[item].image_width height=$CONTENT.products_items[item].image_height lw="216" lh="188" alt=$CONTENT.products_items[item].name}</a></div>
<div class="name"><a href="{$CONTEXT.URL}p/{$CONTENT.products_items[item].link}{$CONTEXT.URL_SUFFIX}">{$CONTENT.products_items[item].name}</a></div>
<div class="desc">{$CONTENT.products_items[item].introtext}</div>
<a href="{$CONTEXT.URL}p/{$CONTENT.products_items[item].link}{$CONTEXT.URL_SUFFIX}"><div class="more"></div></a>
</div>
{/section}
</div>
<div class="h-video">
<span class="title"></span>
<div class="pb"></div>
</div>
</div>
</div>

{literal}
<script type="text/javascript" language="javascript">
$(document).ready(function(){
	var h_events_items_count = $('#h-events-items li').length;
	var h_events_items_cc = 0;
	$('#h-events-items ul').css("width",h_events_items_count*168+2);
	$('#h-events-nav-left').click(function(){
			h_events_items_cc=h_events_items_cc-1;
			if( h_events_items_cc < 0 ){
				h_events_items_cc = 0;
			}
			$('#h-events-items').animate({scrollLeft: h_events_items_cc*168}, 
				300, 'swing', //swing/linear, 
				function(){
					// Animation complete.
					})});
	$('#h-events-nav-right').click(function(){
			h_events_items_cc=h_events_items_cc+1;
			if( h_events_items_cc+3 > h_events_items_count ){
				h_events_items_cc = h_events_items_count-3;
			}
			$('#h-events-items').animate({scrollLeft: h_events_items_cc*168}, 
				300, 'swing', //swing/linear, 
				function(){
					// Animation complete.
					})});
});
</script>
{/literal}